<template>
  <div class="drawal">
    <van-nav-bar
      title="钱包提现"
      left-text="返回"
      left-arrow
      :fixed="true"
      :placeholder="true"
      @click-left="$router.back(-1)"
    >
    </van-nav-bar>
      <van-tabs
        v-model:active="active"
        title-inactive-color="#000"
        title-active-color="#fc4253"
        background="#fff"
        color="#fc4253"
      >
        <van-tab
          v-for="(value, index) in navbar"
          :key="index"
          :name="value.code"
          :title="value.name"
        >
          <component :is="value.url" v-if="active == value.code"></component>
        </van-tab>
      </van-tabs>
  </div>
</template>
<script>
import { reactive, toRefs } from "vue";
import drawalList from "@/components/profit/drawal/drawalList";
import todrawal from "@/components/profit/drawal/todrawal";
export default {
  components: {
    drawalList,
    todrawal,
  },
  setup() {
    const data = reactive({
      navbar: [
        { name: "钱包", url: "drawalList", code: 1 },
        { name: "提现", url: "todrawal", code: 2 },
      ],
      active: 2,
    });
    return { ...toRefs(data) };
  },
};
</script>
<style lang="scss" scoped>
.drawal {
  height: 100%;
  background: #f7f7f7;
}
</style>